import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import "qrc:/qml/styles" as Styles
import "qrc:/qml/components"

Rectangle {
    id: callerTab
    color: "transparent"

    readonly property var callerModel: GlobalResourceViewModel && GlobalResourceViewModel.callerListModel
                                     ? GlobalResourceViewModel.callerListModel
                                     : null
    readonly property int callerCount: callerModel && typeof callerModel.count === "number" ? callerModel.count : 0
    readonly property int totalCallers: GlobalResourceViewModel && typeof GlobalResourceViewModel.totalCallerCount === "number"
                                        ? GlobalResourceViewModel.totalCallerCount
                                        : 0
    readonly property int onlineCallers: GlobalResourceViewModel && typeof GlobalResourceViewModel.onlineCallerCount === "number"
                                         ? GlobalResourceViewModel.onlineCallerCount
                                         : 0
    readonly property int offlineCallers: Math.max(0, totalCallers - onlineCallers)
    readonly property int colWidthId: 140
    readonly property int colWidthTask: 200
    readonly property int colWidthStatus: 180
    readonly property int colWidthTime: 240

    ColumnLayout {
        anchors.fill: parent
        anchors.margins: Styles.Theme.spacingLarge
        spacing: Styles.Theme.spacingLarge

        // KPI summary
        Row {
            Layout.fillWidth: true
            spacing: Styles.Theme.spacingNormal

            KpiCard {
                width: 200
                height: 100
                title: "呼叫器总数"
                value: totalCallers
                iconSource: "📞"
                accentColor: Styles.Theme.primary
                enableValueAnimation: false
            }

            KpiCard {
                width: 200
                height: 100
                title: "在线呼叫器"
                value: onlineCallers
                iconSource: "✅"
                accentColor: Styles.Theme.success
                enableValueAnimation: false
            }

            KpiCard {
                width: 200
                height: 100
                title: "离线呼叫器"
                value: offlineCallers
                iconSource: "⚠"
                accentColor: Styles.Theme.warning
                enableValueAnimation: false
            }
        }

        Rectangle {
            Layout.fillWidth: true
            Layout.fillHeight: true
            color: Styles.Theme.surface
            radius: Styles.Theme.radiusNormal

            ColumnLayout {
                anchors.fill: parent
                anchors.margins: Styles.Theme.spacingNormal
                spacing: Styles.Theme.spacingNormal

                RowLayout {
                    Layout.fillWidth: true

                    Text {
                        text: "呼叫器列表"
                        font.pixelSize: Styles.Theme.fontSizeLarge
                        font.weight: Styles.Theme.fontWeightBold
                        color: Styles.Theme.textPrimary
                    }

                    Rectangle {
                        Layout.preferredHeight: 28
                        Layout.alignment: Qt.AlignVCenter
                        radius: Styles.Theme.radiusLarge
                        color: Styles.Theme.surfaceVariant
                        border.color: Styles.Theme.border
                        border.width: 1
                        RowLayout {
                            anchors.fill: parent
                            anchors.margins: Styles.Theme.spacingSmall
                            spacing: Styles.Theme.spacingXSmall
                            Text {
                                text: "在线率"
                                font.pixelSize: Styles.Theme.fontSizeSmall
                                color: Styles.Theme.textSecondary
                            }
                            Text {
                                text: totalCallers === 0 ? "0%" : Math.round(onlineCallers * 100 / totalCallers) + "%"
                                font.pixelSize: Styles.Theme.fontSizeSmall
                                font.weight: Styles.Theme.fontWeightMedium
                                color: Styles.Theme.textPrimary
                            }
                        }
                    }

                    Item { Layout.fillWidth: true }

                    ActionButton {
                        text: "刷新"
                        iconSource: "qrc:/icons/refresh.svg"
                        size: "small"
                        onClicked: {
                            if (GlobalResourceViewModel) {
                                GlobalResourceViewModel.refreshCallerData();
                            }
                        }
                    }
                }

                Rectangle {
                    Layout.fillWidth: true
                    height: 44
                    color: Styles.Theme.surfaceHeader
                    radius: Styles.Theme.radiusSmall

                    RowLayout {
                        anchors.fill: parent
                        anchors.leftMargin: Styles.Theme.spacingNormal
                        anchors.rightMargin: Styles.Theme.spacingNormal
                        spacing: Styles.Theme.spacingNormal

                        Text {
                            Layout.preferredWidth: colWidthId
                            Layout.alignment: Qt.AlignVCenter
                            text: "呼叫器编号"
                            font.pixelSize: Styles.Theme.fontSizeNormal
                            font.weight: Styles.Theme.fontWeightMedium
                            color: Styles.Theme.textSecondary
                        }

                        Text {
                            Layout.preferredWidth: colWidthTask
                            Layout.alignment: Qt.AlignVCenter
                            text: "任务名称"
                            font.pixelSize: Styles.Theme.fontSizeNormal
                            font.weight: Styles.Theme.fontWeightMedium
                            color: Styles.Theme.textSecondary
                        }

                        Text {
                            Layout.preferredWidth: colWidthStatus
                            Layout.alignment: Qt.AlignVCenter
                            text: "在线状态"
                            font.pixelSize: Styles.Theme.fontSizeNormal
                            font.weight: Styles.Theme.fontWeightMedium
                            color: Styles.Theme.textSecondary
                        }

                        Text {
                            Layout.preferredWidth: colWidthTime
                            Layout.alignment: Qt.AlignVCenter
                            text: "上一次触发时间"
                            font.pixelSize: Styles.Theme.fontSizeNormal
                            font.weight: Styles.Theme.fontWeightMedium
                            color: Styles.Theme.textSecondary
                        }

                        Item { width: 1; Layout.fillWidth: true }
                    }
                }

                Item {
                    Layout.fillWidth: true
                    Layout.fillHeight: true

                    ListView {
                        id: callerListView
                        anchors.fill: parent
                        clip: true
                        spacing: 0
                        boundsBehavior: Flickable.StopAtBounds
                        model: callerModel ? callerModel : 0

                        delegate: Rectangle {
                            id: listItem
                            width: callerListView.width
                            height: 64
                            radius: Styles.Theme.radiusSmall
                            color: index % 2 === 0 ? Styles.Theme.surface : Styles.Theme.backgroundAlternate

                            // 平滑的颜色过渡
                            Behavior on color {
                                ColorAnimation { duration: Styles.Theme.animationFast }
                            }

                            RowLayout {
                                anchors.fill: parent
                                anchors.leftMargin: Styles.Theme.spacingNormal
                                anchors.rightMargin: Styles.Theme.spacingNormal
                                spacing: Styles.Theme.spacingNormal

                                Item {
                                    Layout.preferredWidth: colWidthId
                                    Layout.alignment: Qt.AlignVCenter

                                    Column {
                                        width: parent.width
                                        anchors.verticalCenter: parent.verticalCenter
                                        spacing: 2
                                        Text {
                                            text: callerNum > 0 ? ("#" + callerNum) : "-"
                                            font.pixelSize: Styles.Theme.fontSizeNormal
                                            font.weight: Styles.Theme.fontWeightMedium
                                            color: Styles.Theme.textPrimary
                                        }
                                        Text {
                                            text: isOnline ? "等待触发" : "信号丢失"
                                            font.pixelSize: Styles.Theme.fontSizeSmall
                                            color: isOnline ? Styles.Theme.textSecondary : Styles.Theme.danger
                                        }
                                    }
                                }

                                Item {
                                    Layout.preferredWidth: colWidthTask
                                    Layout.alignment: Qt.AlignVCenter

                                    Column {
                                        width: parent.width
                                        anchors.verticalCenter: parent.verticalCenter
                                        spacing: 2
                                        Text {
                                            text: taskName && taskName.length > 0 ? taskName : "未配置任务"
                                            font.pixelSize: Styles.Theme.fontSizeNormal
                                            font.weight: Styles.Theme.fontWeightMedium
                                            color: Styles.Theme.textPrimary
                                            elide: Text.ElideRight
                                        }
                                        Text {
                                            text: taskName && taskName.length > 0 ? "任务映射" : "缺少映射"
                                            font.pixelSize: Styles.Theme.fontSizeSmall
                                            color: taskName && taskName.length > 0 ? Styles.Theme.textSecondary : Styles.Theme.danger
                                        }
                                    }
                                }

                                StatusIndicator {
                                    Layout.preferredWidth: colWidthStatus
                                    Layout.alignment: Qt.AlignVCenter
                                    label: isOnline ? "在线" : "离线"
                                    status: isOnline ? "success" : "error"
                                    animated: false
                                    showIndicator: true
                                    size: "small"
                                }

                                Text {
                                    Layout.preferredWidth: colWidthTime
                                    Layout.alignment: Qt.AlignVCenter
                                    text: lastTriggerText && lastTriggerText.length > 0 ? lastTriggerText : "未触发"
                                    font.pixelSize: Styles.Theme.fontSizeNormal
                                    color: lastTriggerText && lastTriggerText.length > 0
                                           ? Styles.Theme.textPrimary
                                           : Styles.Theme.textSecondary
                                }

                                Item { Layout.fillWidth: true }
                            }

                            MouseArea {
                                anchors.fill: parent
                                hoverEnabled: true
                                propagateComposedEvents: true
                                onEntered: listItem.color = Styles.Theme.surfaceVariant
                                onExited: listItem.color = index % 2 === 0 ? Styles.Theme.surface : Styles.Theme.backgroundAlternate
                                onPressed: function(mouse) { mouse.accepted = false }
                                onClicked: function(mouse) { mouse.accepted = false }
                            }
                        }

                        ScrollBar.vertical: ScrollBar {
                            policy: ScrollBar.AsNeeded
                        }
                    }

                    Column {
                        anchors.centerIn: parent
                        spacing: Styles.Theme.spacingSmall
                        visible: callerListView.count === 0
                        opacity: 0.9

                        Text {
                            text: "暂无呼叫器数据"
                            font.pixelSize: Styles.Theme.fontSizeLarge
                            font.weight: Styles.Theme.fontWeightBold
                            color: Styles.Theme.textSecondary
                            horizontalAlignment: Text.AlignHCenter
                        }

                        Text {
                            text: "请检查地图配置或点击刷新按钮"
                            font.pixelSize: Styles.Theme.fontSizeNormal
                            color: Styles.Theme.textSecondary
                            horizontalAlignment: Text.AlignHCenter
                        }
                    }
                }
            }
        }
    }
}
